<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>邀约活动管理 - CRM旅游管理系统</title>
    <link rel="stylesheet" href="../../../shared/styles/apple-design.css">
    <link rel="stylesheet" href="../styles/invitation-management.css">
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
</head>
<body>
    <!-- 顶部导航栏 -->
    <nav class="top-navbar">
        <div class="nav-container">
            <div class="nav-left">
                <div class="nav-brand">
                    <i class="fas fa-map-marked-alt"></i>
                    <span>CRM旅游系统</span>
                </div>
                <div class="nav-breadcrumb">
                    <span class="breadcrumb-item">业务管理</span>
                    <i class="fas fa-chevron-right"></i>
                    <span class="breadcrumb-item active">邀约活动</span>
                </div>
            </div>
            <div class="nav-right">
                <button class="nav-button" id="notifications-btn">
                    <i class="fas fa-bell"></i>
                    <span class="notification-badge">5</span>
                </button>
                <div class="user-menu">
                    <img src="https://via.placeholder.com/32x32/007AFF/FFFFFF?text=管" alt="用户头像" class="user-avatar">
                    <span class="user-name">管理员</span>
                    <i class="fas fa-chevron-down"></i>
                </div>
            </div>
        </div>
    </nav>

    <!-- 侧边栏 -->
    <aside class="sidebar">
        <div class="sidebar-content">
            <div class="sidebar-section">
                <h3 class="sidebar-title">客户管理</h3>
                <ul class="sidebar-menu">
                    <li class="menu-item">
                        <a href="customer-list.html" class="menu-link">
                            <i class="fas fa-users"></i>
                            <span>客户档案</span>
                        </a>
                    </li>
                    <li class="menu-item">
                        <a href="#" class="menu-link">
                            <i class="fas fa-user-plus"></i>
                            <span>新增客户</span>
                        </a>
                    </li>
                    <li class="menu-item">
                        <a href="#" class="menu-link">
                            <i class="fas fa-tags"></i>
                            <span>标签管理</span>
                        </a>
                    </li>
                </ul>
            </div>
            
            <div class="sidebar-section">
                <h3 class="sidebar-title">业务管理</h3>
                <ul class="sidebar-menu">
                    <li class="menu-item active">
                        <a href="invitation-management.html" class="menu-link">
                            <i class="fas fa-calendar-check"></i>
                            <span>邀约活动</span>
                        </a>
                    </li>
                    <li class="menu-item">
                        <a href="#" class="menu-link">
                            <i class="fas fa-chart-line"></i>
                            <span>销售机会</span>
                        </a>
                    </li>
                    <li class="menu-item">
                        <a href="#" class="menu-link">
                            <i class="fas fa-map-marker-alt"></i>
                            <span>线路产品</span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </aside>

    <!-- 主内容区 -->
    <main class="main-content">
        <!-- 页面头部 -->
        <header class="page-header">
            <div class="header-left">
                <h1 class="page-title">邀约活动管理</h1>
                <p class="page-subtitle">管理各种形式的客户邀约活动，提升客户参与度和转化率</p>
            </div>
            <div class="header-right">
                <button class="btn btn-secondary" id="activity-template-btn">
                    <i class="fas fa-file-alt"></i>
                    活动模板
                </button>
                <button class="btn btn-primary" id="create-activity-btn">
                    <i class="fas fa-plus"></i>
                    创建活动
                </button>
            </div>
        </header>

        <!-- 快速统计卡片 -->
        <section class="stats-section">
            <div class="stats-grid">
                <div class="stat-card">
                    <div class="stat-icon stat-primary">
                        <i class="fas fa-calendar-alt"></i>
                    </div>
                    <div class="stat-content">
                        <div class="stat-number">28</div>
                        <div class="stat-label">进行中活动</div>
                        <div class="stat-change positive">
                            <i class="fas fa-arrow-up"></i>
                            +3
                        </div>
                    </div>
                </div>

                <div class="stat-card">
                    <div class="stat-icon stat-success">
                        <i class="fas fa-users"></i>
                    </div>
                    <div class="stat-content">
                        <div class="stat-number">1,456</div>
                        <div class="stat-label">已邀请客户</div>
                        <div class="stat-change positive">
                            <i class="fas fa-arrow-up"></i>
                            +156
                        </div>
                    </div>
                </div>

                <div class="stat-card">
                    <div class="stat-icon stat-warning">
                        <i class="fas fa-user-check"></i>
                    </div>
                    <div class="stat-content">
                        <div class="stat-number">892</div>
                        <div class="stat-label">确认参加</div>
                        <div class="stat-change positive">
                            <i class="fas fa-arrow-up"></i>
                            +89
                        </div>
                    </div>
                </div>

                <div class="stat-card">
                    <div class="stat-icon stat-info">
                        <i class="fas fa-percentage"></i>
                    </div>
                    <div class="stat-content">
                        <div class="stat-number">61.3%</div>
                        <div class="stat-label">平均参与率</div>
                        <div class="stat-change positive">
                            <i class="fas fa-arrow-up"></i>
                            +2.1%
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <!-- 搜索和筛选区域 -->
        <section class="search-filter-section">
            <div class="search-filter-container">
                <!-- 搜索框 -->
                <div class="search-box">
                    <i class="fas fa-search search-icon"></i>
                    <input type="text" placeholder="搜索活动名称、主题或活动编号" class="search-input" id="search-input">
                    <button class="search-clear" id="search-clear">
                        <i class="fas fa-times"></i>
                    </button>
                </div>

                <!-- 筛选器 -->
                <div class="filter-controls">
                    <div class="filter-group">
                        <label class="filter-label">活动状态</label>
                        <select class="filter-select" id="status-filter">
                            <option value="">全部状态</option>
                            <option value="筹备中">筹备中</option>
                            <option value="进行中">进行中</option>
                            <option value="已结束">已结束</option>
                            <option value="已取消">已取消</option>
                        </select>
                    </div>

                    <div class="filter-group">
                        <label class="filter-label">活动类型</label>
                        <select class="filter-select" id="type-filter">
                            <option value="">全部类型</option>
                            <option value="产品推介会">产品推介会</option>
                            <option value="目的地分享会">目的地分享会</option>
                            <option value="客户答谢会">客户答谢会</option>
                            <option value="小型茶话会">小型茶话会</option>
                            <option value="线上活动">线上活动</option>
                        </select>
                    </div>

                    <div class="filter-group">
                        <label class="filter-label">时间范围</label>
                        <select class="filter-select" id="date-filter">
                            <option value="">全部时间</option>
                            <option value="今天">今天</option>
                            <option value="本周">本周</option>
                            <option value="本月">本月</option>
                            <option value="下月">下月</option>
                        </select>
                    </div>

                    <button class="btn btn-outline" id="reset-filters">
                        <i class="fas fa-undo"></i>
                        重置
                    </button>
                </div>
            </div>
        </section>

        <!-- 活动列表 -->
        <section class="table-section">
            <div class="table-header">
                <div class="table-title">
                    <h2>活动列表</h2>
                    <span class="result-count">共 45 个活动</span>
                </div>
                <div class="table-actions">
                    <button class="btn btn-outline" id="export-btn">
                        <i class="fas fa-download"></i>
                        导出报表
                    </button>
                    <div class="view-toggle">
                        <button class="view-btn active" data-view="table">
                            <i class="fas fa-list"></i>
                        </button>
                        <button class="view-btn" data-view="grid">
                            <i class="fas fa-th"></i>
                        </button>
                    </div>
                </div>
            </div>

            <!-- 表格视图 -->
            <div class="table-container" id="table-view">
                <table class="activity-table">
                    <thead>
                        <tr>
                            <th class="sortable" data-sort="activity_number">
                                活动编号
                                <i class="fas fa-sort"></i>
                            </th>
                            <th class="sortable" data-sort="name">
                                活动名称
                                <i class="fas fa-sort"></i>
                            </th>
                            <th>活动类型</th>
                            <th class="sortable" data-sort="date">
                                活动时间
                                <i class="fas fa-sort"></i>
                            </th>
                            <th>活动地点</th>
                            <th>邀请人数</th>
                            <th>确认人数</th>
                            <th>参与率</th>
                            <th>活动状态</th>
                            <th class="actions-column">操作</th>
                        </tr>
                    </thead>
                    <tbody id="activity-table-body">
                        <!-- 活动数据行 -->
                        <tr class="activity-row" data-activity-id="1">
                            <td class="activity-number">ACT20250721001</td>
                            <td class="activity-name">
                                <div class="activity-info">
                                    <div class="activity-title">桂林山水3日游分享会</div>
                                    <div class="activity-theme">体验桂林山水之美，享受悠闲假期</div>
                                </div>
                            </td>
                            <td>
                                <span class="type-badge type-presentation">产品推介会</span>
                            </td>
                            <td>
                                <div class="date-info">
                                    <div class="date">2025-07-25</div>
                                    <div class="time">14:30-16:30</div>
                                </div>
                            </td>
                            <td>
                                <div class="location-info">
                                    <div class="venue">市民文化中心</div>
                                    <div class="address">多功能厅A</div>
                                </div>
                            </td>
                            <td class="invited-count">156</td>
                            <td class="confirmed-count">98</td>
                            <td class="participation-rate">
                                <div class="rate-bar">
                                    <div class="rate-fill" style="width: 62.8%"></div>
                                </div>
                                <span class="rate-text">62.8%</span>
                            </td>
                            <td>
                                <span class="status-badge status-preparing">筹备中</span>
                            </td>
                            <td class="actions">
                                <div class="action-buttons">
                                    <button class="action-btn" title="查看详情" onclick="viewActivity(1)">
                                        <i class="fas fa-eye"></i>
                                    </button>
                                    <button class="action-btn" title="编辑" onclick="editActivity(1)">
                                        <i class="fas fa-edit"></i>
                                    </button>
                                    <button class="action-btn" title="客户管理" onclick="manageInvitations(1)">
                                        <i class="fas fa-users"></i>
                                    </button>
                                    <button class="action-btn" title="更多操作" onclick="showMoreActions(1)">
                                        <i class="fas fa-ellipsis-h"></i>
                                    </button>
                                </div>
                            </td>
                        </tr>

                        <tr class="activity-row" data-activity-id="2">
                            <td class="activity-number">ACT20250720001</td>
                            <td class="activity-name">
                                <div class="activity-info">
                                    <div class="activity-title">厦门鼓浪屿文艺之旅</div>
                                    <div class="activity-theme">感受海滨城市的浪漫与文艺气息</div>
                                </div>
                            </td>
                            <td>
                                <span class="type-badge type-destination">目的地分享会</span>
                            </td>
                            <td>
                                <div class="date-info">
                                    <div class="date">2025-07-23</div>
                                    <div class="time">09:30-11:30</div>
                                </div>
                            </td>
                            <td>
                                <div class="location-info">
                                    <div class="venue">社区活动中心</div>
                                    <div class="address">会议室B</div>
                                </div>
                            </td>
                            <td class="invited-count">85</td>
                            <td class="confirmed-count">67</td>
                            <td class="participation-rate">
                                <div class="rate-bar">
                                    <div class="rate-fill" style="width: 78.8%"></div>
                                </div>
                                <span class="rate-text">78.8%</span>
                            </td>
                            <td>
                                <span class="status-badge status-ongoing">进行中</span>
                            </td>
                            <td class="actions">
                                <div class="action-buttons">
                                    <button class="action-btn" title="查看详情" onclick="viewActivity(2)">
                                        <i class="fas fa-eye"></i>
                                    </button>
                                    <button class="action-btn" title="现场管理" onclick="manageOnsite(2)">
                                        <i class="fas fa-clipboard-check"></i>
                                    </button>
                                    <button class="action-btn" title="客户管理" onclick="manageInvitations(2)">
                                        <i class="fas fa-users"></i>
                                    </button>
                                    <button class="action-btn" title="更多操作" onclick="showMoreActions(2)">
                                        <i class="fas fa-ellipsis-h"></i>
                                    </button>
                                </div>
                            </td>
                        </tr>

                        <tr class="activity-row" data-activity-id="3">
                            <td class="activity-number">ACT20250718001</td>
                            <td class="activity-name">
                                <div class="activity-info">
                                    <div class="activity-title">夏季老客户答谢茶话会</div>
                                    <div class="activity-theme">感谢老客户的支持与信任</div>
                                </div>
                            </td>
                            <td>
                                <span class="type-badge type-appreciation">客户答谢会</span>
                            </td>
                            <td>
                                <div class="date-info">
                                    <div class="date">2025-07-20</div>
                                    <div class="time">15:00-17:00</div>
                                </div>
                            </td>
                            <td>
                                <div class="location-info">
                                    <div class="venue">公司会议室</div>
                                    <div class="address">3楼大会议室</div>
                                </div>
                            </td>
                            <td class="invited-count">45</td>
                            <td class="confirmed-count">38</td>
                            <td class="participation-rate">
                                <div class="rate-bar">
                                    <div class="rate-fill" style="width: 84.4%"></div>
                                </div>
                                <span class="rate-text">84.4%</span>
                            </td>
                            <td>
                                <span class="status-badge status-finished">已结束</span>
                            </td>
                            <td class="actions">
                                <div class="action-buttons">
                                    <button class="action-btn" title="查看详情" onclick="viewActivity(3)">
                                        <i class="fas fa-eye"></i>
                                    </button>
                                    <button class="action-btn" title="效果分析" onclick="analyzeResults(3)">
                                        <i class="fas fa-chart-line"></i>
                                    </button>
                                    <button class="action-btn" title="后续跟进" onclick="manageFollowup(3)">
                                        <i class="fas fa-tasks"></i>
                                    </button>
                                    <button class="action-btn" title="更多操作" onclick="showMoreActions(3)">
                                        <i class="fas fa-ellipsis-h"></i>
                                    </button>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>

            <!-- 卡片视图 -->
            <div class="grid-container" id="grid-view" style="display: none;">
                <div class="activity-grid" id="activity-grid-body">
                    <!-- 活动卡片 -->
                    <div class="activity-card" data-activity-id="1" onclick="viewActivity(1)">
                        <div class="card-header">
                            <div class="activity-type">
                                <span class="type-badge type-presentation">产品推介会</span>
                            </div>
                            <div class="activity-status">
                                <span class="status-badge status-preparing">筹备中</span>
                            </div>
                        </div>
                        
                        <div class="card-body">
                            <div class="activity-title">桂林山水3日游分享会</div>
                            <div class="activity-theme">体验桂林山水之美，享受悠闲假期</div>
                            
                            <div class="activity-details">
                                <div class="detail-item">
                                    <i class="fas fa-calendar-alt"></i>
                                    <span>2025-07-25</span>
                                </div>
                                <div class="detail-item">
                                    <i class="fas fa-clock"></i>
                                    <span>14:30-16:30</span>
                                </div>
                                <div class="detail-item">
                                    <i class="fas fa-map-marker-alt"></i>
                                    <span>市民文化中心</span>
                                </div>
                            </div>

                            <div class="participation-stats">
                                <div class="stat-item">
                                    <div class="stat-number">156</div>
                                    <div class="stat-label">已邀请</div>
                                </div>
                                <div class="stat-item">
                                    <div class="stat-number">98</div>
                                    <div class="stat-label">已确认</div>
                                </div>
                                <div class="stat-item">
                                    <div class="stat-number">62.8%</div>
                                    <div class="stat-label">参与率</div>
                                </div>
                            </div>

                            <div class="progress-bar">
                                <div class="progress-fill" style="width: 62.8%"></div>
                            </div>
                        </div>

                        <div class="card-footer">
                            <button class="card-footer-btn primary" onclick="editActivity(1, event)">
                                <i class="fas fa-edit"></i>
                                <span>编辑活动</span>
                            </button>
                            <button class="card-footer-btn secondary" onclick="manageInvitations(1, event)">
                                <i class="fas fa-users"></i>
                                <span>客户管理</span>
                            </button>
                        </div>
                    </div>

                    <div class="activity-card" data-activity-id="2" onclick="viewActivity(2)">
                        <div class="card-header">
                            <div class="activity-type">
                                <span class="type-badge type-destination">目的地分享会</span>
                            </div>
                            <div class="activity-status">
                                <span class="status-badge status-ongoing">进行中</span>
                            </div>
                        </div>
                        
                        <div class="card-body">
                            <div class="activity-title">厦门鼓浪屿文艺之旅</div>
                            <div class="activity-theme">感受海滨城市的浪漫与文艺气息</div>
                            
                            <div class="activity-details">
                                <div class="detail-item">
                                    <i class="fas fa-calendar-alt"></i>
                                    <span>2025-07-23</span>
                                </div>
                                <div class="detail-item">
                                    <i class="fas fa-clock"></i>
                                    <span>09:30-11:30</span>
                                </div>
                                <div class="detail-item">
                                    <i class="fas fa-map-marker-alt"></i>
                                    <span>社区活动中心</span>
                                </div>
                            </div>

                            <div class="participation-stats">
                                <div class="stat-item">
                                    <div class="stat-number">85</div>
                                    <div class="stat-label">已邀请</div>
                                </div>
                                <div class="stat-item">
                                    <div class="stat-number">67</div>
                                    <div class="stat-label">已确认</div>
                                </div>
                                <div class="stat-item">
                                    <div class="stat-number">78.8%</div>
                                    <div class="stat-label">参与率</div>
                                </div>
                            </div>

                            <div class="progress-bar">
                                <div class="progress-fill" style="width: 78.8%"></div>
                            </div>
                        </div>

                        <div class="card-footer">
                            <button class="card-footer-btn primary" onclick="manageOnsite(2, event)">
                                <i class="fas fa-clipboard-check"></i>
                                <span>现场管理</span>
                            </button>
                            <button class="card-footer-btn secondary" onclick="manageInvitations(2, event)">
                                <i class="fas fa-users"></i>
                                <span>客户管理</span>
                            </button>
                        </div>
                    </div>

                    <div class="activity-card" data-activity-id="3" onclick="viewActivity(3)">
                        <div class="card-header">
                            <div class="activity-type">
                                <span class="type-badge type-appreciation">客户答谢会</span>
                            </div>
                            <div class="activity-status">
                                <span class="status-badge status-finished">已结束</span>
                            </div>
                        </div>
                        
                        <div class="card-body">
                            <div class="activity-title">夏季老客户答谢茶话会</div>
                            <div class="activity-theme">感谢老客户的支持与信任</div>
                            
                            <div class="activity-details">
                                <div class="detail-item">
                                    <i class="fas fa-calendar-alt"></i>
                                    <span>2025-07-20</span>
                                </div>
                                <div class="detail-item">
                                    <i class="fas fa-clock"></i>
                                    <span>15:00-17:00</span>
                                </div>
                                <div class="detail-item">
                                    <i class="fas fa-map-marker-alt"></i>
                                    <span>公司会议室</span>
                                </div>
                            </div>

                            <div class="participation-stats">
                                <div class="stat-item">
                                    <div class="stat-number">45</div>
                                    <div class="stat-label">已邀请</div>
                                </div>
                                <div class="stat-item">
                                    <div class="stat-number">38</div>
                                    <div class="stat-label">已确认</div>
                                </div>
                                <div class="stat-item">
                                    <div class="stat-number">84.4%</div>
                                    <div class="stat-label">参与率</div>
                                </div>
                            </div>

                            <div class="progress-bar">
                                <div class="progress-fill" style="width: 84.4%"></div>
                            </div>
                        </div>

                        <div class="card-footer">
                            <button class="card-footer-btn primary" onclick="analyzeResults(3, event)">
                                <i class="fas fa-chart-line"></i>
                                <span>效果分析</span>
                            </button>
                            <button class="card-footer-btn secondary" onclick="manageFollowup(3, event)">
                                <i class="fas fa-tasks"></i>
                                <span>后续跟进</span>
                            </button>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 分页 -->
            <div class="pagination-container">
                <div class="pagination-info">
                    显示第 1-10 条，共 45 条记录
                </div>
                <div class="pagination">
                    <button class="page-btn" disabled>
                        <i class="fas fa-chevron-left"></i>
                    </button>
                    <button class="page-btn active">1</button>
                    <button class="page-btn">2</button>
                    <button class="page-btn">3</button>
                    <button class="page-btn">4</button>
                    <button class="page-btn">5</button>
                    <button class="page-btn">
                        <i class="fas fa-chevron-right"></i>
                    </button>
                </div>
                <div class="page-size-selector">
                    <label>每页显示</label>
                    <select id="page-size">
                        <option value="10">10</option>
                        <option value="20">20</option>
                        <option value="50">50</option>
                    </select>
                    <label>条</label>
                </div>
            </div>
        </section>
    </main>

    <!-- 模态框：创建活动 -->
    <div class="modal-overlay" id="create-activity-modal">
        <div class="modal">
            <div class="modal-header">
                <h3 class="modal-title">创建邀约活动</h3>
                <button class="modal-close" onclick="closeCreateModal()">
                    <i class="fas fa-times"></i>
                </button>
            </div>
            <div class="modal-body">
                <form id="activity-form" class="activity-form">
                    <div class="form-section">
                        <h4 class="section-title">基础信息</h4>
                        <div class="form-row">
                            <div class="form-group">
                                <label class="form-label" for="activity-name">活动名称</label>
                                <input type="text" class="form-input" id="activity-name" placeholder="请输入活动名称" required>
                            </div>
                            <div class="form-group">
                                <label class="form-label" for="activity-type">活动类型</label>
                                <select class="form-select" id="activity-type" required>
                                    <option value="">请选择活动类型</option>
                                    <option value="产品推介会">产品推介会</option>
                                    <option value="目的地分享会">目的地分享会</option>
                                    <option value="客户答谢会">客户答谢会</option>
                                    <option value="小型茶话会">小型茶话会</option>
                                    <option value="线上活动">线上活动</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="form-label" for="activity-theme">活动主题</label>
                            <input type="text" class="form-input" id="activity-theme" placeholder="请输入活动主题">
                        </div>
                    </div>

                    <div class="form-section">
                        <h4 class="section-title">时间地点</h4>
                        <div class="form-row">
                            <div class="form-group">
                                <label class="form-label" for="activity-date">活动日期</label>
                                <input type="date" class="form-input" id="activity-date" required>
                            </div>
                            <div class="form-group">
                                <label class="form-label" for="start-time">开始时间</label>
                                <input type="time" class="form-input" id="start-time" required>
                            </div>
                            <div class="form-group">
                                <label class="form-label" for="end-time">结束时间</label>
                                <input type="time" class="form-input" id="end-time" required>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group">
                                <label class="form-label" for="venue">活动地点</label>
                                <input type="text" class="form-input" id="venue" placeholder="请输入活动地点" required>
                            </div>
                            <div class="form-group">
                                <label class="form-label" for="capacity">容纳人数</label>
                                <input type="number" class="form-input" id="capacity" placeholder="请输入容纳人数" min="1" max="500">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="form-label" for="address">详细地址</label>
                            <input type="text" class="form-input" id="address" placeholder="请输入详细地址">
                        </div>
                    </div>

                    <div class="form-section">
                        <h4 class="section-title">活动内容</h4>
                        <div class="form-group">
                            <label class="form-label" for="activity-description">活动描述</label>
                            <textarea class="form-textarea" id="activity-description" rows="4" placeholder="请详细描述活动内容、流程、目标等"></textarea>
                        </div>
                        <div class="form-row">
                            <div class="form-group">
                                <label class="form-label" for="target-audience">目标客户群体</label>
                                <select class="form-select" id="target-audience" multiple>
                                    <option value="vip">VIP客户</option>
                                    <option value="high-value">高价值客户</option>
                                    <option value="existing">老客户</option>
                                    <option value="potential">潜在客户</option>
                                    <option value="new">新客户</option>
                                </select>
                            </div>
                            <div class="form-group">
                                <label class="form-label" for="expected-attendance">预期参与人数</label>
                                <input type="number" class="form-input" id="expected-attendance" placeholder="预期参与人数" min="1">
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group">
                                <label class="form-label" for="budget">活动预算</label>
                                <input type="number" class="form-input" id="budget" placeholder="活动预算（元）" min="0" step="100">
                            </div>
                            <div class="form-group">
                                <label class="form-label" for="contact-person">活动负责人</label>
                                <select class="form-select" id="contact-person" required>
                                    <option value="">请选择负责人</option>
                                    <option value="zhang-san">张三</option>
                                    <option value="li-si">李四</option>
                                    <option value="wang-wu">王五</option>
                                    <option value="zhao-liu">赵六</option>
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="form-section">
                        <h4 class="section-title">邀请设置</h4>
                        <div class="form-row">
                            <div class="form-group">
                                <label class="form-label" for="invitation-method">邀请方式</label>
                                <div class="checkbox-group">
                                    <label class="checkbox-item">
                                        <input type="checkbox" name="invitation-method" value="phone">
                                        <span class="checkbox-label">电话邀请</span>
                                    </label>
                                    <label class="checkbox-item">
                                        <input type="checkbox" name="invitation-method" value="sms">
                                        <span class="checkbox-label">短信邀请</span>
                                    </label>
                                    <label class="checkbox-item">
                                        <input type="checkbox" name="invitation-method" value="wechat">
                                        <span class="checkbox-label">微信邀请</span>
                                    </label>
                                    <label class="checkbox-item">
                                        <input type="checkbox" name="invitation-method" value="email">
                                        <span class="checkbox-label">邮件邀请</span>
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group">
                                <label class="form-label" for="invitation-deadline">邀请截止时间</label>
                                <input type="datetime-local" class="form-input" id="invitation-deadline">
                            </div>
                            <div class="form-group">
                                <label class="form-label" for="reminder-days">提醒设置</label>
                                <select class="form-select" id="reminder-days">
                                    <option value="">不设置提醒</option>
                                    <option value="1">活动前1天提醒</option>
                                    <option value="2">活动前2天提醒</option>
                                    <option value="3">活动前3天提醒</option>
                                    <option value="7">活动前1周提醒</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="form-label" for="invitation-message">邀请话术模板</label>
                            <textarea class="form-textarea" id="invitation-message" rows="3" placeholder="请输入邀请客户时使用的话术模板"></textarea>
                        </div>
                    </div>

                    <div class="form-section">
                        <h4 class="section-title">其他设置</h4>
                        <div class="form-row">
                            <div class="form-group">
                                <label class="form-label">活动状态</label>
                                <div class="radio-group">
                                    <label class="radio-item">
                                        <input type="radio" name="activity-status" value="draft" checked>
                                        <span class="radio-label">草稿</span>
                                    </label>
                                    <label class="radio-item">
                                        <input type="radio" name="activity-status" value="scheduled">
                                        <span class="radio-label">已安排</span>
                                    </label>
                                    <label class="radio-item">
                                        <input type="radio" name="activity-status" value="published">
                                        <span class="radio-label">已发布</span>
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="form-label" for="special-requirements">特殊要求</label>
                            <textarea class="form-textarea" id="special-requirements" rows="2" placeholder="请输入特殊要求或注意事项"></textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" onclick="closeCreateModal()">取消</button>
                <button class="btn btn-primary" onclick="saveActivity()">创建活动</button>
            </div>
        </div>
    </div>

    <!-- 模态框：操作菜单 -->
    <div class="modal-overlay" id="action-menu-modal">
        <div class="action-menu">
            <button class="action-menu-item" onclick="duplicateActivity()">
                <i class="fas fa-copy"></i>
                <span>复制活动</span>
            </button>
            <button class="action-menu-item" onclick="exportActivity()">
                <i class="fas fa-download"></i>
                <span>导出数据</span>
            </button>
            <button class="action-menu-item" onclick="sendReminder()">
                <i class="fas fa-bell"></i>
                <span>发送提醒</span>
            </button>
            <button class="action-menu-item" onclick="viewHistory()">
                <i class="fas fa-history"></i>
                <span>查看历史</span>
            </button>
            <button class="action-menu-item danger" onclick="cancelActivity()">
                <i class="fas fa-times-circle"></i>
                <span>取消活动</span>
            </button>
            <button class="action-menu-item cancel" onclick="closeActionMenu()">
                <i class="fas fa-times"></i>
                <span>取消</span>
            </button>
        </div>
    </div>

    <!-- JavaScript -->
    <script src="../scripts/invitation-management.js"></script>
</body>
</html>